<div class="advice-container">
      <p class="paragraph">A D V I S E # 140</p>
      <div class="advice-details">“If your hair is thinning, try dying your hair a similar tone to your scalp.”</div>
<div class="pattern-divider">
<svg width="295" height="16" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path fill="#4F5D74" d="M0 8h122v1H0zM173 8h122v1H173z"></path><g transform="translate(138)" fill="#CEE3E9"><rect width="6" height="16" rx="3"></rect><rect x="14" width="6" height="16" rx="3"></rect></g></g></svg>
</div>
<button>
        <svg class="icon-dice" width="24" height="24" xmlns="http://www.w3.org/2000/svg"><path d="M20 0H4a4.005 4.005 0 0 0-4 4v16a4.005 4.005 0 0 0 4 4h16a4.005 4.005 0 0 0 4-4V4a4.005 4.005 0 0 0-4-4ZM7.5 18a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm0-9a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm4.5 4.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm4.5 4.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm0-9a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Z" fill="#202733"></path></svg>
</button>
</div>
<style>
/* From Uiverse.io by sabbircoder07 - Tags: card, css effect, css3 */
.advice-container {
  font-family: "Manrope", sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 320px;
  height: auto;
  background-color: hsl(217, 19%, 24%);
  border-radius: 10px;
  padding: 30px 16px 0 16px;
}

.paragraph {
  font-size: 17px;
  background-image: linear-gradient(to right, hsl(150, 100%, 66%),#C031B5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: 1px;
  /*Reason: there are some contrast issues*/
}

.advice-details {
  color: hsl(193, 38%, 86%);
  font-size: 20px;
  font-weight: 500;
  margin: 30px 0;
  line-height: 25px;
  text-wrap: balance;
  letter-spacing: 1px;
}

.pattern-divider path {
  fill: hsl(217, 19%, 38%);
}

button {
  height: 55px;
  width: 55px;
  border-radius: 50%;
  border: none;
  background: #00e673;
  margin-top: 20px;
  margin-bottom: -25px;
  cursor: pointer;
  transition: 0.3s all
}

button:hover {
  box-shadow: 0rem 0rem 10px 10px rgba(82, 255, 168, 0.5);
}



</style>
